<!doctype html>
<html lang="zh">
<head>
    {% load static %}
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>test</title>
	<link rel="stylesheet" type="text/css" href="{% static 'css/normalize.css' %}" />
	<link rel="stylesheet" type="text/css" href="{% static 'css/default.css' %}">
	<link rel="stylesheet" type="text/css" href="{% static 'css/pgwslideshow.css' %}">
</head>
<body>
	<div class="htmleaf-container">
		<div class="htmleaf-content bgcolor-3">
			<ul class="pgwSlideshow">
			    <li><img src="{% static 'img/1.jpg' %}" alt="San Francisco, USA" data-description="Golden Gate Bridge"></li>
			    <li><img src="{% static 'img/2.jpg' %}" alt="Rio de Janeiro, Brazil"></li>
			    <li><img src="{% static 'img/3.jpg' %}" alt="" data-large-src="img/london.jpg"></li>

			</ul>

		</div>
	</div>

	<script src="{% static 'js/jquery-1.11.0.min.js' %}" type="text/javascript"></script>
	<script type="text/javascript" src="{% static 'js/pgwslideshow.min.js' %}"></script>
	<script type="text/javascript">
		$(document).ready(function() {
		    $('.pgwSlideshow').pgwSlideshow({
		    	transitionEffect:'fading',
		    	autoSlide:true
		    });
		});
	</script>
</body>
</html>